import React, { useEffect, useRef } from 'react'
import * as echarts from 'echarts';
function Mycharts(props) {
    let {option,width,height,data}=props
    const box =useRef()
    const myChart=useRef()
    useEffect(()=>{
         myChart.current = echarts.init(box.current);
      myChart.current.setOption(option);
      let fn=()=>{
         myChart.current.resize();

      }
      window.addEventListener('resize',fn)
      return ()=>{
        window.removeEventListener('resize',fn)
        myChart.current.dispose();
      }
    },[])
    useEffect(()=>{
     myChart.current.setOption(option);
    },[data])
  return (
    <div ref={box} style={{width:width,height:height}}>
      
    </div>
  )
}

export default Mycharts
